---
import { Code as StarlightCode } from '@astrojs/starlight/components';
import { CodeBlockWrapper } from '../components/react/CodeBlockWrapper';
import { fixImports } from '@/lib/utils';

const { title = '', code = '', lang = 'tsx' } = Astro.props;
---

<CodeBlockWrapper client:only>
  <StarlightCode title={title} code={fixImports(code)} lang={lang} ins={'inverted'} />
</CodeBlockWrapper>

<style>
  .expressive-code .copy button {
    opacity: 1 !important;
  }
</style>
